<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"/>
    <title></title>
    <link rel="stylesheet" href="./css/base.css"/>
    <link rel="stylesheet" href="./css/index.css"/>
    <link rel="stylesheet" href="./lib/Swiper-4.0.7/dist/css/swiper.css"/>
    <style>
        html, body {
            position: relative;
            height: 100%;
        }

        body {
            background: #eee;
            font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
            font-size: 14px;
            color: #000;
            margin: 0;
            padding: 0;
        }

        .banner {
            width: 100%;
            height: 100%;
        }

        .banner .swiper-slide {
            width: 7.2rem;
            height: 2.87rem;
            text-align: center;
            font-size: 18px;
            background: url("./images/img_bg.png") no-repeat;
            background-size: 100% 2.87rem;

        }
        body {
            background: #eee;
            font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
            font-size: 14px;
            color: #000;
            margin: 0;
            padding: 0;
        }

        .banner {
            width: 100%;
            height: 100%;
        }

        .banner .swiper-slide {
            width: 7.2rem;
            height: 2.87rem;
            text-align: center;
            font-size: 18px;
            background: url("./images/img_bg.png") no-repeat;
            background-size: 7.2rem 2.87rem;
            /* Center slide text vertically */
            display: -webkit-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            -webkit-justify-content: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
        }

        .swiper-pagination-bullet-active {
            opacity: 1;
            background: #faa9c0;
        }

        .swiper-button-next, .swiper-container-rtl .swiper-button-prev {
            background-image: url("./images/icon_right.png");
            width: 0.22rem;
            height: 0.4rem;
            background-size: 0.22rem 0.4rem;
            top: 66%;
        }

        .swiper-button-prev, .swiper-container-rtl .swiper-button-next {
            background-image: url("./images/icon_left.png");
            width: 0.22rem;
            height: 0.4rem;
            background-size: 0.22rem 0.4rem;
            top: 66%;
        }
    </style>
</head>

<body>

<div class="warp">
    <header>
        <!-- 没登录状态图-->
        <div class="swiper-container banner">
            <div class="swiper-wrapper">
                <div class="swiper-slide"></div>
                <div class="swiper-slide"></div>
                <div class="swiper-slide"></div>

            </div>
            <!-- Add Pagination -->
            <div class="swiper-pagination"></div>
        </div>
        <!--登录后状态图-->
        <div class="phase">
            <div class="phase_in">
                <div class="nickname_box clearfix">
                    <p class="fl">
                        昵称: <span id="nick">芳华</span>
                    </p>
                    <a href="my_news.html" class="news fr"></a>
                </div>
                <div class="period_box">
						<span class="fetation">孕 <i>4</i> 周
						</span>
                    <p id="time">
                        距离预产期还有 <span>246</span>天
                    </p>
                </div>
            </div>
        </div>
    </header>
    <div class="main">
        <!-- 动态-->
        <div class="dynamic_box">
            <div class="dynamic_t clearfix">
                <div class="dynamic_b fl">
                    <span>动态 | </span>
                </div>
                <!--<span class="new">最新优惠打8折!!!</span>-->
                <marquee behavior = "scroll" direction = "left" behavior = "scroll" style="position: absolute">
                    最新优惠打8折!!!
                </marquee>
            </div>
            <div class="dynamic_n">
                <div class="dynamic_in">
                    <div class="kind_box">
                        <div class="doctor" id="doctor">
                            <a href="#">
                                <div class="pic fl"></div>
                                <div class="right">
                                    <h3>名医动态</h3>
                                    <p>名医提醒，实时</p>
                                    <p>关注您健康</p>
                                </div>
                            </a>
                        </div>
                        <div class="infant">
                            <a href="#">
                                <div class="pic fl"></div>
                                <div class="right" id="shop">
                                    <h3>母婴商城</h3>
                                    <p>专为孕妈提供的</p>
                                    <p>购物平台</p>
                                </div>
                            </a>
                        </div>
                    </div>
                    <div class="kind_bottom">
                        <div class="doctor" id="yuesao">
                            <a href="#">
                                <div class="pic fl"></div>
                                <div class="right">
                                    <h3>月嫂风采</h3>
                                    <p>月嫂实时关注您</p>
                                    <p>健康</p>
                                </div>
                            </a>

                        </div>
                        <div class="infant">
                            <a href="registered.html">
                                <div class="pic fl"></div>
                                <div class="right">
                                    <h3>在线问答</h3>
                                    <p>专业、及时的在</p>
                                    <p>线健康咨询服务</p>
                                </div>
                            </a>
                        </div>
                    </div>
                </div>
            </div>

        </div>
        <!-- 推荐-->
        <div class="recommend">
            <div class="recommend_top">
                <span>今日推荐</span>
            </div>
            <div class="recommend_bottom clearfix">
                <div class="recommentd-swiper doctor_sex">
                    <div class="swiper-wrapper">
                        <div class="swiper-slide">
                            <div class="pic">
                                <span >上医</span>
                            </div>
                            <div class="doctor_box">
                                <ul id="sy">
                                    <!-- <li><a href="#"><span class="li"></span>
                                        <p>李医生</p></a></li>
                                    <li><a href="#"><span class="zhang"></span>
                                        <p>张医生</p></a></li>
                                    <li><a href="#"><span class="zhao"></span>
                                        <p>赵医生</p></a></li> -->
                                </ul>
                            </div>
                        </div>
                        <div class="swiper-slide">
                            <div class="pic">
                                <span >月嫂</span>
                            </div>
                            <div class="doctor_box">
                                <ul id="ys">
                                    <!-- <li><a href="#"><span class="li"></span>
                                        <p>李医生</p></a></li>
                                    <li><a href="#"><span class="zhang"></span>
                                        <p>张医生</p></a></li>
                                    <li><a href="#"><span class="zhao"></span>
                                        <p>赵医生</p></a></li> -->
                                </ul>
                            </div>
                        </div>
                        <div class="swiper-slide">
                            <div class="pic">
                                <span>管家</span>
                            </div>
                            <div class="doctor_box">
                                <ul id="gj">
                                    <!-- <li><a href="#"><span class="li"></span>
                                        <p>李医生</p></a></li>
                                    <li><a href="#"><span class="zhang"></span>
                                        <p>张医生</p></a></li>
                                    <li><a href="#"><span class="zhao"></span>
                                        <p>赵医生</p></a></li> -->
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="swiper-button-next"></div>
                <div class="swiper-button-prev"></div>
            </div>
        </div >

        <!-- 精品套餐-->
        <div class="combo">
            <div class="combo_top">
                <span>精品套餐</span>
            </div>
            <div class="combo_bottom clearfix">
                <div class="pic fl">
                    <a href="#"></a>
                </div>
                <div class="right">
                    <div class="top clearfix">
                        <h3 class="fl">套餐名称</h3>
                        <span class="fr">¥25800</span>
                    </div>
                    <div class="text">套餐介绍套餐介绍套餐介绍套餐介绍套餐介绍套餐介绍套餐介绍套餐介绍</div>
                    <div class="yuyue fr">
                        <a href="#" class="order">立即预约</a>
                    </div>
                </div>
            </div>
        </div>


        <!--支付后显示-->
        <div class="classify_box" style="display: none">
            <div class="classify">
                <a href="#" class="sijiao">私教</a>
                <a href="#" class="guanjia">管家</a>
                <a href="#" class="shangyi">上医</a>
                <a href="#" class="ziji">自己</a>
                <a href="#" class="yuesao">月嫂</a>
                <a href="#" class="yizhu">医助</a>
                <a href="#" class="yingyangshi">营养师</a>
            </div>
        </div>
    </div>


    <!-- 底部-->
    <footer class="footer">
        <ul>
            <li><a href="#"><span class="home active0"></span>
                <p>首页</p></a></li>
            <li><a href="record.html"><span class="jilu"></span>
                <p>记录</p></a></li>
            <li><a href="#"><span class="zhishi"></span>
                <p>知识</p></a></li>
            <li><a href="#"><span class="ziji"></span>
                <p>我的</p></a></li>
        </ul>
    </footer>

</div>





</body>


<script src="./js/base.js"></script>
<script src="./js/jquery-1.12.4.js"></script>
<script src="./js/jquery.cookie.js"></script>
<script src="./lib/layer/layer.js"></script>
<script src="./lib/Swiper-4.0.7/dist/js/swiper.min.js"></script>
<script src="./js/index.js"></script>


<script>
    todayRoleName();
    var html_today="";
    function todayRoleName(){
        html_today="";
        $("#today").empty();

        $.post(baseURL+"yuesao/sysuser/recommendlist",{"roleName":"管家"},function(result){
            html_today="";
            $.each(result.data,function(n,t){
                html_today='<li><a href="#"><span onclick="checkRole(this)" id="'+t.userId+'" class="li"></span><p>'+t.name+'</p></a></li>';
            });
            $("#gj").empty().append(html_today);
            $.each(result.data,function(n,t){

                $("#"+t.userId).css("background-image", "url(" + baseURL2+t.photo + ")");
            });
        });

        $.post(baseURL+"yuesao/sysuser/recommendlist",{"roleName":"月嫂"},function(result){
            html_today="";
            $.each(result.data,function(n,t){
                html_today='<li><a href="#"><span onclick="checkRole(this)" id="'+t.userId+'" class="li"></span><p>'+t.name+'</p></a></li>';
            });
            $("#ys").empty().append(html_today);
            $.each(result.data,function(n,t){
                $("#"+t.userId).css("background-image", "url(" + baseURL2+t.photo + ")");
            });
        });

        $.post(baseURL+"yuesao/sysuser/recommendlist",{"roleName":"上医"},function(result){
            html_today="";
            $.each(result.data,function(n,t){
                html_today='<li><a href="#"><span onclick="checkRole(this)" id="'+t.userId+'" class="li"></span><p>'+t.name+'</p></a></li>';
            });
            $("#sy").empty().append(html_today);
            $.each(result.data,function(n,t){

                $("#"+t.userId).css("background-image", "url(" + baseURL2+t.photo + ")");
            });
        });

    }
    function checkRole(val){
        window.location.href="doctor-intro.html?val="+val.id;
    }
    var swiper = new Swiper('.swiper-container', {
        spaceBetween: 30,
        pagination: {
            el: '.swiper-pagination',
            clickable: true,
        },
        autoplay: {
            delay: 3000,
            stopOnLastSlide: false,
            disableOnInteraction: true,
        },
    });

    var swiper2 = new Swiper('.recommentd-swiper', {
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        },
    });
</script>

<script type="text/javascript">
    var serviceTemplate = '<div class="combo_bottom clearfix">'
            + '<div class="pic fl"><a href="#"></a></div>'
            + '<div class="right">' + '<div class="top clearfix">'
            + '<h3 class="fl">[name]</h3>' + '<span class="fr">[price]</span>'
            + '</div>'
            + '<div class="text">套餐介绍套餐介绍套餐介绍套餐介绍套餐介绍套餐介绍套餐介绍套餐介绍</div>'
            + '<div class="yuyue fr"><a href="#" id="" onclick="lijy(this)" class="order">立即预约</a> </div>'
            + '</div>'
            + '</div>';
    function lijy(val){
        window.location.href="yuyuetaocan.html?"+val.id;
    }
    //加载服务列表
    function loadYueSaoServiceList() {
        $.post(baseURL+"yuesao/service/list", {
            page: 1,
            pageSize: 100
        }, function (result) {
            if (result.code == "USR000") {
                $('.combo_bottom').remove();
                var services = result.data.list;
                for (var i = 0; i < services.length; i++) {
                    var div = serviceTemplate.replace('[name]',
                            services[i].serviceName).replace('[price]', services[i].teamPrice);
                    div = $(div);
                    div.find('.order').attr("id",services[i].serviceId);
                    div.find('.text').empty().html(services[i].introduce);
                    div.find('.pic').css('background-image','url(./images/icon_right.png)');
                    div.data('serviceId', services[i].serviceId);
                    $('.combo').append(div);
                }
            } else if (result.code == "USR108") {
                layer.open({
                    content: result.msg
                    , btn: ['确定',],
                    skin: 'my-skin'
                    , yes: function (index) {
                        layer.close(index);
                    }
                });
            } else if (result.code == "USR100") {
                layer.open({
                    content: result.msg
                    , btn: ['确定',],
                    skin: 'my-skin'
                    , yes: function (index) {
                        layer.close(index);
                    }
                });
            } else if (result.code == "USR201") {
                layer.open({
                    content: result.msg
                    , btn: ['确定',],
                    skin: 'my-skin'
                    , yes: function (index) {
                        layer.close(index);
                    }
                });
            }
        });
    }
    $('#shop').click(function(){
        window.location.href="shop.html";
    });

    $('#doctor').click(getDoctordt);
    $('#yuesao').click(getYuesaoFC);
    //判断用户是否购买服务
    function check(){
        var sessionId=sessionStorage['sessionId'];
        var datt=false;
        $.ajax({
            url:baseURL+'yuesao/tuser/orderrole',
            data:{sessionid:sessionId},
            async: false,
            success:function (result) {
                if(result.code=="USR000"){
                    datt=true;
                    return true;
                }else if(result.code=="USR124"){
                    layer.open({
                        content: result.msg
                        , btn: ['确定',],
                        skin: 'my-skin'
                        , yes: function (index) {
                            layer.close(index);
                            window.location.href="login.html";
                        }
                    });

                }else if(result.code=="USR201"){
                    layer.open({
                        content: result.msg
                        , btn: ['确定',],
                        skin: 'my-skin'
                        , yes: function (index) {
                            layer.close(index);
                        }
                    });
                }else if(result.code=="USR103"){
                    datt=false;
                    return false;
                }
            }
        });
        return datt;
    }
    //医生动态跳转
    function getDoctordt() {
        var data = check();
        if (data) {
            window.location.href = "doctor-02.html";
            return;
        }
        window.location.href = "doctor-01.html";
    }
    //月嫂动态跳转
    function getYuesaoFC(){
        console.log("yuesao");
        var data=check();

        if(data){
            window.location.href="maternity-02.html";
            return;
        }
        window.location.href="maternity-01.html";

    }
    loadYueSaoServiceList();

    function showUserInformation(){
        //判断用户是否登录
        var sessionid=sessionStorage['sessionId'];
        console.log(sessionid);
        if(sessionid){
            $('.banner').hide();
            $('.phase').show();
        }
        $.post(baseURL+"yuesao/userInfo",{mobile:sessionStorage['mobile']},function (result) {
            if(result.code=="USR000"){
                var user=result.data;

                if(result.data.status==0){
                    $('#nick').text(user.userName);
                    if(user.mark==0){
                        $('.fetation').text('月经期');
                    }else if(user.mark==1){
                        $('.fetation').text('卵泡期');
                    }else if(user.mark==2){
                        $('.fetation').text('排卵期');
                    }else if(user.mark==3){
                        $('.fetation').text('黄体期');
                    }
                    $('.fetation').text();
                    $('#time').html("第 <span>"+user.days+"</span>天");
                }else if(result.data.status==1){
                    $('#nick').text(user.userName);
                    $('.fetation').html("孕 <i>"+user.week+"</i> 周");
                    if(week>40){
                        $('#time').html("您已超过预产期 <span>"+user.days+"</span>天");
                    }else {
                        $('#time').html("距离预产期还有 <span>" + user.days + "</span>天");
                    }
                }else if(result.data.status==2){
                    $('#nick').text(user.userName+"的宝宝");
                    $('.fetation').remove();
                    $('#time').html("宝宝今天你已经<span>" + user.days + "</span>天了");
                }
            }
        });
        var data=check();
        console.log("data:"+ data);
        if(data){
            $('.recommend').hide();
            $('.combo').hide();
            $('.classify_box').show();
        }
    }

</script>
</html>